<!-- 内部通讯录 -->
<!--盒子头-->
<div class="box-header">
	<h3 class="box-title">内部通讯录</h3>
	<a class="btn btn-sm btn-default thisrefresh" href="javascript:void(0);" title="刷新" style="padding: 5px;margin-top: -8px;">
		<span class="glyphicon glyphicon-refresh"></span>
	</a>
	<div class="box-tools">
		<div class="input-group" style="width: 150px;">
			<input type="text" class="form-control input-sm baseKey" placeholder="按部门/角色/用户名/电话号码/拼音" value="" style="width: 220px;">
			<div class="input-group-btn">
				<a class="btn btn-sm btn-default baseKeySumbit"> 
					<span class="glyphicon glyphicon-search"></span>
				</a>
			</div>
		</div>
	</div>
</div>
<!--盒子身体-->
<div class="box-body no-padding">
	<div class="table-responsive">
		<table class="table table-hover table-striped">
			<tbody><tr>
				<th scope="col">部门</th>
				<th scope="col">职位</th>
				<th scope="col">头像</th>
				<th scope="col">姓名</th>
				<th scope="col">性别</th>
				<th scope="col">Tel</th>
				<th scope="col">E-mail</th>
				<th scope="col">操作</th>
			</tr>
			<tr>
				<td><span>总经办</span></td>
				<td><span>超级管理员</span></td>
				<td><a href="#"> <img src="image//647cbde6-3fba-4d8c-a50f-1a07f9bee417.jpg" class="img-circle" style="width: 24px; height: 24px;">
				</a></td>
				<td><span>罗密欧</span></td>
				<td><span>
					<img src="images/male.png" alt="男" style="width: 20px;height: 20px">
				</span></td>
				<td><span>13272143450</span></td>
				<td><span>1057@qq.com</span></td>
				<td>
					<a href="javascript:void(0);" userid="1" class="label xiugai inlookthis">
						<span class="glyphicon glyphicon-search"></span> 查看
					</a> 
				</td>
			</tr>
			<tr>
				<td><span>总经办</span></td>
				<td><span>CEO</span></td>
				<td><a href="#"> <img src="image/handsome.JPG" class="img-circle" style="width: 24px; height: 24px;">
				</a></td>
				<td><span>朱丽叶</span></td>
				<td><span>
					<img src="images/female.png" alt="女" style="width: 20px;height: 20px">
				</span></td>
				<td><span>13203318185</span></td>
				<td><span>aaluoxiang@foxmail.com</span></td>
				<td>
					<a href="javascript:void(0);" userid="2" class="label xiugai inlookthis">
						<span class="glyphicon glyphicon-search"></span> 查看
					</a> 
				</td>
			</tr>
			<tr>
				<td><span>总经办</span></td>
				<td><span>CEO</span></td>
				<td><a href="#"> <img src="image/timg.jpg" class="img-circle" style="width: 24px; height: 24px;">
				</a></td>
				<td><span>wuianan</span></td>
				<td><span>
					<img src="images/male.png" alt="男" style="width: 20px;height: 20px">
				</span></td>
				<td><span>13600003532</span></td>
				<td><span>qq@qq.com</span></td>
				<td>
					<a href="javascript:void(0);" userid="35" class="label xiugai inlookthis">
						<span class="glyphicon glyphicon-search"></span> 查看
					</a> 
				</td>
			</tr>
			<tr>
				<td><span>总经办</span></td>
				<td><span>总经理</span></td>
				<td><a href="#"> <img src="image/eightman.jpeg" class="img-circle" style="width: 24px; height: 24px;">
				</a></td>
				<td><span>伊丽莎白</span></td>
				<td><span>
					<img src="images/female.png" alt="女" style="width: 20px;height: 20px">
				</span></td>
				<td><span>18683688154</span></td>
				<td><span>255@qq.com</span></td>
				<td>
					<a href="javascript:void(0);" userid="3" class="label xiugai inlookthis">
						<span class="glyphicon glyphicon-search"></span> 查看
					</a> 
				</td>
			</tr>
			<tr>
				<td><span>研发部</span></td>
				<td><span>研发部经理</span></td>
				<td><a href="#"> <img src="image/fiveman.jpeg" class="img-circle" style="width: 24px; height: 24px;">
				</a></td>
				<td><span>小李父斯基</span></td>
				<td><span>
					<img src="images/male.png" alt="男" style="width: 20px;height: 20px">
				</span></td>
				<td><span>18173328888</span></td>
				<td><span>164@qq.com</span></td>
				<td>
					<a href="javascript:void(0);" userid="4" class="label xiugai inlookthis">
						<span class="glyphicon glyphicon-search"></span> 查看
					</a> 
				</td>
			</tr>
			<tr>
				<td><span>研发部</span></td>
				<td><span>高级工程师</span></td>
				<td><a href="#"> <img src="image/threeman.jpeg" class="img-circle" style="width: 24px; height: 24px;">
				</a></td>
				<td><span>瑞王</span></td>
				<td><span>
					<img src="images/male.png" alt="男" style="width: 20px;height: 20px">
				</span></td>
				<td><span>13117336953</span></td>
				<td><span>1057@qq.com</span></td>
				<td>
					<a href="javascript:void(0);" userid="11" class="label xiugai inlookthis">
						<span class="glyphicon glyphicon-search"></span> 查看
					</a> 
				</td>
			</tr>
			<tr>
				<td><span>研发部</span></td>
				<td><span>程序员</span></td>
				<td><a href="#"> <img src="image/timg.jpg" class="img-circle" style="width: 24px; height: 24px;">
				</a></td>
				<td><span>测试小张</span></td>
				<td><span>
					<img src="images/male.png" alt="男" style="width: 20px;height: 20px">
				</span></td>
				<td><span>13548731822</span></td>
				<td><span>123456@qq.com</span></td>
				<td>
					<a href="javascript:void(0);" userid="37" class="label xiugai inlookthis">
						<span class="glyphicon glyphicon-search"></span> 查看
					</a> 
				</td>
			</tr>
			<tr>
				<td><span>研发部</span></td>
				<td><span>程序员</span></td>
				<td><a href="#"> <img src="image/sevenman.jpeg" class="img-circle" style="width: 24px; height: 24px;">
				</a></td>
				<td><span>甄姬2</span></td>
				<td><span>
					<img src="images/female.png" alt="女" style="width: 20px;height: 20px">
				</span></td>
				<td><span>13117336954</span></td>
				<td><span>188@qq.com</span></td>
				<td>
					<a href="javascript:void(0);" userid="8" class="label xiugai inlookthis">
						<span class="glyphicon glyphicon-search"></span> 查看
					</a> 
				</td>
			</tr>
			<tr>
				<td><span>研发部</span></td>
				<td><span>程序员</span></td>
				<td><a href="#"> <img src="image/fourman.jpeg" class="img-circle" style="width: 24px; height: 24px;">
				</a></td>
				<td><span>上上签</span></td>
				<td><span>
					<img src="images/male.png" alt="男" style="width: 20px;height: 20px">
				</span></td>
				<td><span>18868688866</span></td>
				<td><span>55@qq.com</span></td>
				<td>
					<a href="javascript:void(0);" userid="28" class="label xiugai inlookthis">
						<span class="glyphicon glyphicon-search"></span> 查看
					</a> 
				</td>
			</tr>
			<tr>
				<td><span>研发部</span></td>
				<td><span>系统架构师</span></td>
				<td><a href="#"> <img src="image/fiveman.jpeg" class="img-circle" style="width: 24px; height: 24px;">
				</a></td>
				<td><span>丹琪</span></td>
				<td><span>
					<img src="images/male.png" alt="男" style="width: 20px;height: 20px">
				</span></td>
				<td><span>13117336953</span></td>
				<td><span>aaluoxiang@foxmail.com</span></td>
				<td>
					<a href="javascript:void(0);" userid="12" class="label xiugai inlookthis">
						<span class="glyphicon glyphicon-search"></span> 查看
					</a> 
				</td>
			</tr>
		</tbody></table>
	</div>
</div>
<!--盒子尾-->
<div class="box-footer no-padding" style="margin-top: -20px;">
	<div style="padding: 5px;">
		<div id="page" style="background: #fff; border: 0px; margin-top: 0px; padding: 2px; height: 25px;">
			<div style="width: 40%; float: left;">
				<div class="pageInfo" style="margin-left: 5px;">
					共<span>31</span>条 | 每页<span>10</span>条
					| 共<span>4</span>页
				</div>
			</div>
			<div style="width: 60%; float: left;">
				<div class="pageOperation">
				<!--判断是否是第一页  -->
					<a class="btn btn-sm btn-default no-padding tablefirst" disabled="disabled" style="width: 30px; height: 20px;"> <span class="glyphicon glyphicon-backward"></span></a> 
					<a class="btn btn-sm btn-default no-padding tableup" disabled="disabled" style="width: 30px; height: 20px;"> <span class="glyphicon glyphicon-triangle-left"></span></a> 
				<a disabled="disabled" class="btn btn-default no-padding" style="width: 30px; height: 20px;">
						1
				</a>
				<!--判断是否是最后一页  -->
					<a class="btn btn-sm btn-default no-padding tabledown" style="width: 30px; height: 20px;"> <span class="glyphicon glyphicon-triangle-right"></span></a> 
					<a class="btn btn-sm btn-default no-padding tablelast" style="width: 30px; height: 20px;"> <span class="glyphicon glyphicon-forward"></span></a> 
				</div>
			</div>
		</div>
	</div>
</div>
<script>
		/* 分页插件按钮的点击事件 */
		/* url是从后台接收过来的链接，sort是记录排序规则 */
		$('.tablefirst').on('click',function(){
			 if(true==false){
				 $('.thistable').load('inaddresspaging?page=0');
			 }
		});
		$('.tableup').on('click',function(){
			 if(true==false){
				 $('.thistable').load('inaddresspaging?page=-1');
			 }
		});
		$('.tabledown').on('click',function(){
			if(false==false){
				$('.thistable').load('inaddresspaging?page=1');
			 }
		});
		$('.tablelast').on('click',function(){
			if(false==false){
				$('.thistable').load('inaddresspaging?page=3');
			 }
			
		});
		
		/*类型、状态、时间的排序  */
		$('.thistype').on('click', function() {
			if ($(this).children().hasClass('glyphicon-triangle-bottom')) {
				$('.thistable').load('inaddresspaging?type=0&icon=glyphicon-triangle-top');
			} else {
				$('.thistable').load('inaddresspaging?type=1&icon=glyphicon-triangle-bottom');
			}
		});
		$('.thisstatus').on('click', function() {
			if ($(this).children().hasClass('glyphicon-triangle-bottom')) {
				$('.thistable').load('inaddresspaging?status=0&icon=glyphicon-triangle-top');
			} else {
				$('.thistable').load('inaddresspaging?status=1&icon=glyphicon-triangle-bottom');
			}
		});
		$('.thistime').on('click', function() {
			if ($(this).children().hasClass('glyphicon-triangle-bottom')) {
				$('.thistable').load('inaddresspaging?time=0&icon=glyphicon-triangle-top');
			} else {
				$('.thistable').load('inaddresspaging?time=1&icon=glyphicon-triangle-bottom');
			}
		});
		$('.thisvisit').on('click', function() {
			if ($(this).children().hasClass('glyphicon-triangle-bottom')) {
				$('.thistable').load('inaddresspaging?visitnum=0&icon=glyphicon-triangle-top');
			} else {
				$('.thistable').load('inaddresspaging?visitnum=1&icon=glyphicon-triangle-bottom');
			}
		});
		/* 查找 */
		$('.baseKetsubmit').on('click', function() {
			var baseKey = $('.baseKey').val();
			console.log(baseKey);
			$('.thistable').load('inaddresspaging?baseKey='+baseKey+'');
		});
</script>